<script setup>
import { onShow, onShareAppMessage, onShareTimeline } from "@dcloudio/uni-app";
import { ref } from "vue";
import tabbarView from "../components/tabbar.vue";
import { useUserStore } from "../../stores/user";
import { earnCount, skip, productnumber, mine } from "@/services/user";
import { messagenumber } from "@/services/message";
import { goPage } from "@/utils/newpage";
import { userloginStore } from "@/stores/islogin.js";
import { formatPrice } from "@/utils/formatPrice";
import { des_phone } from "@/utils/desensitization";

// 图片资源
import icon1 from "@/static/my/icon-1.png";
import icon2 from "@/static/my/icon-2.png";
import icon3 from "@/static/my/icon-3.png";
import icon4 from "@/static/my/icon-4.png";
import icon5 from "@/static/my/icon-5.png";

import listicon1 from "@/static/my/icon-gm1.png";
import listicon2 from "@/static/my/icon-gm2.png";
import listicon3 from "@/static/my/icon-gm3.png";
import listicon4 from "@/static/my/icon-gm4.png";
import listicon5 from "@/static/my/icon-gm5.png";
import listicon6 from "@/static/my/icon-gm6.png";
import listicon7 from "@/static/my/icon-gm7.png";
import listicon8 from "@/static/my/icon-gm8.png";
import listicon9 from "@/static/my/collection-img.png";
import listicon10 from "@/static/my/my_money.png";

const user = useUserStore();
const userlogin = userloginStore();
const userinfo = ref(null);
const numobj = ref({});
const balance = ref({});
//#ifdef H5

uni.hideTabBar();
//#endif

async function minefun() {
  let res = await mine();
  balance.value = res.data;
}
onShow(() => {
  earnCountfun();
  // minefun();
  valuetabbar.value = 3;

  if (user.userInfo) {
    userlogin.setlogin(true);
    getuserInfogfun();
  } else {
    productnumberfun();
    messagenumberfun();
    userinfo.value = {
      name: user.userInfo.name,
      nickname: user.userInfo.nickname,
      phone: user.userInfo.phone,
      level: user.userInfo.level,
      avatar: user.userInfo.avatar,
    };
  }
});

const newPage = (item) => {
  goPage(item.url);
};

async function getuserInfogfun() {
  // try {

  if (!uni.getStorageSync("Authorization")) {
    return;
  }
  let res;
  res = await user.getuserInfo();
  if (res.code == 200) {
    userlogin.setlogin(true);
  }

  productnumberfun();
  messagenumberfun();
  userinfo.value = {
    name: res.name,
    nickname: res.nickname,
    phone: res.phone,
    level: res.level,
    avatar: res.avatar,
    referrer: res.referrer,
  };
  // } catch (e) {
  //   uni.showToast({
  //     title: e.info,
  //     icon: "none",
  //   });
  // }
}
async function productnumberfun() {
  let res = await productnumber();
  if (res.code == 200) {
    numobj.value = res.data;
    orderlist.value[0].num = res.data.noPay ? res.data.noPay : "";
    orderlist.value[1].num = res.data.noDeliver ? res.data.noDeliver : "";
    orderlist.value[2].num = res.data.noComment ? res.data.noComment : "";
    orderlist.value[3].num = res.data.refund ? res.data.refund : "";
    orderlist.value[4].num = res.data.all ? "" : "";
  }
}

const taoll = ref(null);
const linkobj = ref(null);
const valuetabbar = ref(3);
const statusBarHeight = ref(0);
const menuButtonInfo = ref(null);

async function earnCountfun() {
  // let res = await earnCount();
  // taoll.value = res.data;
  // let reslink = await skip();
  // linkobj.value = reslink.data;
}

// 响应式数据
//兼容小程序
// #ifdef MP-WEIXIN
menuButtonInfo.value = uni.getMenuButtonBoundingClientRect();
// #endif

statusBarHeight.value = uni.getSystemInfoSync().statusBarHeight;

const no_num = ref(0);
async function messagenumberfun() {
  let res = await messagenumber();
  if (res.code == 200) {
    no_num.value = res.data.no_num;
  }
}

// 前往消息
const goMessageList = () => {
  uni.navigateTo({
    url: "/pages/message-list/Index",
  });
};

const orderlist = ref([
  {
    name: "待付款",
    icon: icon1,
    num: "",
    url: "/pages/order/orderlist/index?status=-1",
    offset: [8, 5],
  },
  {
    name: "待发货",
    icon: icon2,
    num: "",
    url: "/pages/order/orderlist/index?status=1",
    offset: [8, 5],
  },
  {
    name: "待收货",
    icon: icon3,
    num: "",
    url: "/pages/order/orderlist/index?status=2",
    offset: [8, 5],
  },
  {
    name: "售后",
    icon: icon4,
    num: "",
    url: "/pages/order/orderlist/index?status=4",
    offset: [4, 5],
  },
  {
    name: "全部订单",
    icon: icon5,
    num: "",
    url: "/pages/order/orderlist/index?status=-2",
    offset: [0, 0],
  },
]);
const list = ref([
  {
    name: "我的余额",
    icon: listicon10,
    num: 0,
    url: "/pages/mine/myMoney",
  },
  {
    name: "我的团队",
    icon: listicon1,
    num: 0,
    url: "/pages/team/teamcount/index",
    // url: "/pages/client/Index",
  },
  {
    name: "地址管理",
    icon: listicon2,
    num: 0,
    url: "/pages/address/index",
  },
  {
    name: "我的收藏",
    icon: listicon3,
    num: 0,
    url: "/pages/collection/index",
  },
  {
    name: "推广海报",
    icon: listicon4,
    num: 0,
    url: "/pages/poster/index",
  },
  {
    name: "问题解答",
    icon: listicon5,
    num: 0,
    url: "/pages/mine/questionAnswer",
  },
  {
    name: "用户协议",
    icon: listicon6,
    num: 0,
    url: "/pages/mine/userAgreement",
  },

  // {
  //   name: "问题解答",
  //   icon: listicon8,
  //   num: 0,
  //   url: "/pages/mine/questionAnswer",
  // },
  // {
  //   name: "我的收藏",
  //   icon: listicon9,
  //   num: 0,
  //   url: "/pages/collection/index",
  // },
]);
// const list = ref([
//   {
//     name: "地址管理",
//     icon: listicon1,
//     num: 0,
//     url: "/pages/address/index",
//   },
//   {
//     name: "我的足迹",
//     icon: listicon2,
//     num: 0,
//     url: "/pages/mine/myTracks",
//   },
//   {
//     name: "协议查看",
//     icon: listicon3,
//     num: 0,
//     url: "/pages/mine/userAgreement",
//   },
//   {
//     name: "云仓客服",
//     icon: listicon4,
//     num: 0,
//     url: "/pages/order-list/index?status=2",
//   },

//   {
//     name: "我的客户",
//     icon: listicon6,
//     num: 0,
//     url: "/pages/client/Index",
//   },
//   {
//     name: "我的代付",
//     icon: listicon7,
//     num: 0,
//     url: "/pages/mine/proxyPayment",
//   },
//   {
//     name: "问题解答",
//     icon: listicon8,
//     num: 0,
//     url: "/pages/mine/questionAnswer",
//   },
//   {
//     name: "我的收藏",
//     icon: listicon9,
//     num: 0,
//     url: "/pages/collection/index",
//   },
// ]);
const goWork = () => {
  uni.navigateTo({
    url: "/pages/team/shopkeeper/work",
  });
};

const gohbfun = () => {
  uni.navigateTo({
    url: "/pages/poster/index",
  });
};

// 前往推广码
const goProCotionCode = () => {
  uni.navigateTo({
    url: "/pages/promotion-code/Index",
  });
};

const gosettimg = () => {
  uni.navigateTo({
    url: "/pages/mysetting/modify/index",
  });
};

// 去更改推荐人
const goReferee = () => {
  uni.navigateTo({
    url: "/pages/mine/modifySupplier",
  });
};

const callPhone = (phoneNumber) => {
  // 判断手机是否支持拨打电话功能
  if (uni.canIUse("makePhoneCall")) {
    uni.makePhoneCall({
      phoneNumber: phoneNumber, // 电话号码
      success: function () {},
      // fail: function () {
      //   uni.showToast({
      //     title: "拨打电话失败",
      //     icon: "error",
      //   });
      // },
    });
  } else {
    uni.showToast({
      title: "你的设备不支持拨打电话功能",
      icon: "none",
    });
  }
};

const showcard = () => {
  uni.navigateTo({
    url: "/pages/mycard/cardinfo/index",
  });
};
const gobalance = () => {
  uni.navigateTo({
    url: "/pages/servicereward/myreward/balance",
  });
};
const gobalanceindex = () => {
  uni.navigateTo({
    url: "/pages/servicereward/myreward/index",
  });
};

const godetlist = () => {
  uni.navigateTo({
    url: "/pages/servicereward/myreward/rewardlist",
  });
};

const goygfun = () => {
  uni.navigateTo({
    url: "/pages/servicereward/myreward/rewardyg",
  });
};

const goinvoice = () => {
  // uni.navigateTo({
  //   url: "/pages/servicereward/myreward/rewardyg",
  // });

  uni.showToast({
    title: "正在努力研发中",
    icon: "none",
  });
};

// 前往我的工作台
const gomywork = () => {
  uni.navigateTo({
    url: "/pages/team/shopkeeper/myWork",
  });
};

const gopaysjfun = () => {
  uni.navigateTo({
    url: "/pages/upgrade/identitylv",
  });
};

// #ifdef MP-WEIXIN

onShareAppMessage(() => {
  return {
    title: "私语清韵",
    path: "/pages/my/index?referrer_id=" + userinfo.value.promo_code,
    imageUrl:
      "https://m-cloud.yibaitao.com/4b/0fdbe99fed3586dcde22432ac1839b.png",
  };
});

// 朋友圈分享
onShareTimeline(() => {
  return {
    title: "私语清韵",
    path: "/pages/my/index?referrer_id=" + userinfo.value.promo_code,
    imageUr:
      "https://m-cloud.yibaitao.com/4b/0fdbe99fed3586dcde22432ac1839b.png",
  };
});
// #endif
</script>
<template>
  <!-- <up-skeleton :loading="true" :animate="false" avatar rows="2"></up-skeleton> -->
  <view class="my-content u-skeleton">
    <!-- #ifdef APP-PLUS || MP-WEIXIN -->
    <view class="mycontent-top-bc"></view>
    <!-- 
    <view :style="{ height: statusBarHeight + 'px' }"></view>
    <view
      class="my-content-title-name"
      :style="{
        height: menuButtonInfo
          ? menuButtonInfo.height + 'px'
          : statusBarHeight + 'px',
        paddingTop: 0,
        lineHeight: menuButtonInfo
          ? menuButtonInfo.height + 'px'
          : statusBarHeight + 'px',
      }"
      >我的</view
    > -->
    <!-- #endif -->
    <!-- #ifndef MP || APP-PLUS  -->
    <view
      class="mycontent-top-bc"
      :style="{ top: statusBarHeight + 'px' }"
    ></view>

    <!-- #endif -->

    <view class="my-top">
      <view class="my-top-info">
        <view class="my-top-arr">
          <image
            :src="
              userinfo && userinfo.avatar
                ? userinfo.avatar
                : '../../static/index/icom-tx.png'
            "
            mode="aspectFill"
          ></image>
        </view>

        <view class="my-top-nameorphone">
          <view class="my-top-name">
            <text v-if="userinfo && userinfo.nickname">{{
              userinfo.nickname
            }}</text>
            <text v-else>{{
              userinfo && userinfo.name ? userinfo.name : "--"
            }}</text>
            <image
              @click="goProCotionCode"
              src="../../static/index/home_code.png"
              mode="heightFix"
            ></image
          ></view>

          <view class="my-top-phone">
            <text>{{
              userinfo && userinfo.phone ? userinfo.phone : "--"
            }}</text>
            <view
              class="my-level"
              v-if="userinfo && userinfo.level && userinfo.level.icon"
            ></view>
            <image
              :src="
                userinfo && userinfo.level && userinfo.level.icon
                  ? userinfo.level.icon
                  : ''
              "
              mode="heightFix"
            />
          </view>
        </view>
      </view>
      <!-- @click="goProCotionCode" -->
      <view class="my-top-messg">
        <view class="my-massage-name">
          <view class="top-masage-k" @click="goMessageList">
            <uni-badge
              class="uni-badge-left-margin"
              :text="no_num"
              absolute="rightTop"
              size="small"
              :offset="[2, 3]"
            >
              <image src="../../static/my/me_message.png" mode="widthFix" />
            </uni-badge> </view
        ></view>

        <image
          @click="gosettimg"
          src="../../static/my/me_settings.png"
          mode="widthFix"
        ></image>
      </view>
    </view>

    <view
      class="top-upgrade"
      v-if="userinfo && userinfo.level && userinfo.level.id < 201"
    >
      <image
        src="../../static/my/top-icon.png"
        class="top-upgrade-image"
        mode="scaleToFill"
      />
      <view class="top-upgrade-title">
        <image src="../../static/my/lv.png" mode="scaleToFill" />
        <text>成为经销商</text>
      </view>
      <text class="top-upgrade-pay" @click="gopaysjfun">去购买</text>
    </view>
    <view
      class="top-word"
      @click="gomywork"
      v-if="userinfo && userinfo.level && userinfo.level.id >= 201"
    >
      <view class="top-upgrade-title">
        <image src="../../static/my/lv.png" mode="scaleToFill" />
        <text v-if="userinfo && userinfo.level && userinfo.level.id == 201"
          >会员工作台</text
        >
        <text v-if="userinfo && userinfo.level && userinfo.level.id == 301"
          >加盟商工作台</text
        >
        <text v-if="userinfo && userinfo.level && userinfo.level.id == 401"
          >认证店工作台</text
        >
        <text v-if="userinfo && userinfo.level && userinfo.level.id == 501"
          >形象店工作台</text
        >
        <text v-if="userinfo && userinfo.level && userinfo.level.id == 601"
          >旗航店工作台</text
        >
        <text v-if="userinfo && userinfo.level && userinfo.level.id == 999"
          >公司工作台</text
        >
      </view>
      <view class="top-upgrade-pay"
        ><text>我的工作台</text
        ><up-icon name="arrow-right" color="#8C8C8C" size="32rpx"></up-icon
      ></view>
    </view>

    <view class="user-order">
      <view
        class="user-order-item"
        v-for="(item, index) in orderlist"
        :key="index"
        @click="newPage(item)"
      >
        <uni-badge
          class="uni-badge-left-margin"
          :text="item.num"
          absolute="rightTop"
          size="small"
          :offset="item.offset"
        >
          <image :src="item.icon" mode="widthFix" />
          <view class="user-order-name">{{ item.name }}</view></uni-badge
        >
      </view>
    </view>

    <view class="user-order user-list-gn">
      <view
        class="user-order-item"
        v-for="(item, index) in list"
        :key="index"
        @click="newPage(item)"
      >
        <image :src="item.icon" mode="widthFix" />
        <view class="user-order-name">{{ item.name }}</view>
      </view>
    </view>

    <!-- <view
      class="user-ghs"
      v-if="userinfo && userinfo.level && userinfo.level.id <= 201"
    >
      <image src="../../static/my/icon-user.png" mode="widthFix" />
      <text
        >我的推荐人：{{ userinfo ? userinfo.referrer.nickname : "---" }}</text
      >
      <text class="select-ghs" @click="goReferee">更改供货商</text>
    </view> -->

    <!-- <view
      class="my-info"
      v-if="userinfo && userinfo.level && userinfo.level.id > 201"
    >
      <view class="my-info-sf">
        <image src="../../static/my/icon-user1.png" mode="scaleToFill" />
        <text>我的推荐人：</text>
        <text class="my-info-sf-right">{{
          userinfo ? userinfo.referrer.nickname : "---"
        }}</text>
      </view>
      <view class="my-info-sf">
        <image src="../../static/my/icon-ghs.png" mode="scaleToFill" />
        <text>推荐人 ID：</text>
        <text class="my-info-sf-right">{{
          userinfo ? userinfo.referrer.uid : "---"
        }}</text>
        <up-copy :content="userinfo ? userinfo.referrer.uid : '---'">
          <view class="my-info-sf-click"> 复制 </view>
        </up-copy>
      </view>
      <view class="my-info-sf">
        <image src="../../static/my/icon-phone.png" mode="scaleToFill" />
        <text>推荐人手机：</text>
        <text class="my-info-sf-right">{{
          des_phone(userinfo ? userinfo.referrer.phone : "---")
        }}</text>
        <text
          class="my-info-sf-click"
          @click="callPhone(userinfo.referrer.phone)"
          >拨打</text
        >
      </view>
    </view> -->

    <!-- <view class="work-banner">
      <view class="foodr-list">
        <view class="list-index">
          <view class="list-index-left">账户余额</view>
          <view class="list-index-right" @click="godetlist"
            >余额变动明细
            <image
              src="@/static/team/shopkeeper/icon-gm11.png"
              mode="widthFix"
            ></image>
          </view>
        </view>
      </view>

      <u-line></u-line>
      <view class="work-middle">
        <view class="work-middle-left">
          <view class="middle-left-top">账户余额（元）</view>
          <view class="middle-left-footer" @click="gobalanceindex"
            >￥{{ formatPrice(balance.balance || 0) }}</view
          >
        </view>
        <view class="work-middle-right">
          <view class="middle-right-bt" @click="gopayment">代付</view>
          <view class="middle-right-bt withdrawal" @click="gobalance"
            >提现</view
          >
        </view>
      </view>
      <u-line></u-line>

      <view class="work-banner-footer">
        <view class="work-footer-box">
          <view class="left-box">
            <view class="work-left-text">预估收入</view>
            <view class="work-middle-img">
              <uni-tooltip
                class="item"
                content="未出账的预估收益"
                placement="right"
              >
                <view class="item">
                  <u-icon name="question-circle"></u-icon
                ></view>
              </uni-tooltip>
            </view>
            <view class="work-money" @click="goygfun"
              >￥{{ formatPrice(balance.expected_reward || 0) }}</view
            >
          </view>
        </view>
        <view class="work-footer-box">
          <view class="left-box">
            <view class="work-left-text">提现中</view>
            <view class="work-money"
              >￥{{ formatPrice(balance.settle_balance || 0) }}</view
            >
          </view>
        </view>
      </view>
    </view> -->

    <!-- <view
      class="user-haibaoorfapiao"
      v-if="
        (userinfo && userinfo.level && userinfo.level.id == 101) || !userinfo
      "
    >
      <view class="user-haibaoorfapiao-item" @click="gohbfun">
        <image src="../../static/my/icon-haibao.png" mode="widthFix" />
        <text>快速生产海报</text>
      </view>
      <view class="user-haibaoorfapiao-item">
        <image src="../../static/my/icon-fp.png" mode="widthFix" />
        <text>开具发票</text>
      </view>
      <view class="user-haibaoorfapiao-item" @click="showcard">
        <image src="../../static/my/myid.png" mode="widthFix" />
        <text>我的名片</text>
      </view>
    </view> -->
    <!-- 
    <view
      class="my-iofo-content"
      v-if="userinfo && userinfo.level && userinfo.level.id != 101"
    >
      <view class="my-iofo-content-left">
        <view class="my-iofo-content-left-item" @click="gohbfun">
          <image src="../../static/my/icon-haibao.png" mode="widthFix" />
          <text>快速生产海报</text>
        </view>

        <view class="my-iofo-content-left-item">
          <image src="../../static/my/icon-fp.png" mode="widthFix" />
          <text>开具发票</text>
        </view>
        <view class="my-iofo-content-left-item" @click="showcard">
          <image src="../../static/my/myid.png" mode="widthFix" />
          <text>我的名片</text>
        </view>
      </view>

      <view class="my-iofo-content-right" @click="goWork()">
        <image src="../../static/my/icon-word.png" mode="widthFix" />
        <view class="my-iofo-content-right-name">我的工作台</view>
      </view>
    </view> -->

    <!-- <view class="user-shop">
      <view class="user-shop-item"><text>推荐商品</text> </view>

      <view class="shop-list">
        <view class="shop-list-item">
          <view class="shop-list-image">
            <image src="../../static/my/icon-user.png" mode="widthFix" />
          </view>
          <view class="shop-list-name"> 经销商升级大礼包 套餐 </view>
          <view class="shop-list-price">
            <text>¥</text>
            9999
          </view>
        </view>
        <view class="shop-list-item">
          <view class="shop-list-image">
            <image src="../../static/my/icon-user.png" mode="widthFix" />
          </view>
          <view class="shop-list-name"> 经销商升级大礼包 套餐 </view>
          <view class="shop-list-price">
            <text>¥</text>
            9999
          </view>
        </view>
        <view class="shop-list-item">
          <view class="shop-list-image">
            <image src="../../static/my/icon-user.png" mode="widthFix" />
          </view>
          <view class="shop-list-name"> 经销商升级大礼包 套餐 </view>
          <view class="shop-list-price">
            <text>¥</text>
            9999
          </view>
        </view>
      </view>
    </view> -->

    <!-- <view class="user-list">
      <view class="user-list-item" @click="gouphonefun">
        <view class="user-list-item-left">
          <image src="../../static/my/me_xgsjh.png" mode="widthFix" />
          <text>修改手机号</text>
        </view>
        <view class="user-list-item-right">
          <image
            src="../../static/index/common_more_gray.png"
            mode="widthFix"
          />
        </view>
      </view>
      <view class="user-list-item" @click="gomodifyfun">
        <view class="user-list-item-left">
          <image src="../../static/my/me_settings.png" mode="widthFix" />
          <text>设置</text>
        </view>
        <view class="user-list-item-right">
          <image
            src="../../static/index/common_more_gray.png"
            mode="widthFix"
          />
        </view>
      </view>
    </view> -->
  </view>

  <!-- #ifdef MP-WEIXIN || WEB  -->
  <tabbarView :value="valuetabbar"></tabbarView>
  <!-- #endif -->
</template>

<style lang="scss" scoped>
@import "index.scss";
</style>
